<!DOCTYPE html>
<html lang="zh-CN">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
		<title>XXX交易中心网上开户</title>
		<!--{request.contextPath}/bootstrap -->
		<link href="${request.contextPath}/bootstrap/css/bootstrap.min.css" rel="stylesheet">
		<link href="${request.contextPath}/bootstrap/css/fileinput.css" rel="stylesheet">
		<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
		<!--[if lt IE 9]>
      <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
	</head>

	<body>
		<div class="container">
			<h1 style="text-align: center;">XXX交易中心网上开户</h1>
			<hr />
			<form action="${request.contextPath}/register/do" method="post" enctype="multipart/form-data" onsubmit="return checkSubmit()">
				<div class="row">
					<div class="col-md-12">
						<label for="">投资经验：</label>
						<label class="checkbox-inline">
						  <input type="checkbox" id="inlineCheckbox1" name="experience" value="股票"> 股票
						</label>
						<label class="checkbox-inline">
						  <input type="checkbox" id="inlineCheckbox2" name="experience" value="证券"> 证券
						</label>
						<label class="checkbox-inline">
						  <input type="checkbox" id="inlineCheckbox3" name="experience" value="期货"> 期货
						</label>
						<label class="checkbox-inline">
						  <input type="checkbox" id="inlineCheckbox4" name="experience" value="期指"> 期指
						</label>
						<label class="checkbox-inline">
						  <input type="checkbox" id="inlineCheckbox5" name="experience" value="期权"> 期权
						</label>
				        <label class="checkbox-inline">
						  <input type="checkbox" id="inlineCheckbox6" name="experience" value="贵金属"> 贵金属
						</label>
						<label class="checkbox-inline">
						  <input type="checkbox" id="inlineCheckbox7" name="experience" value="房地产"> 房地产
						</label>
						<label class="checkbox-inline">
						  <input type="checkbox" id="inlineCheckbox8" name="experience" value="银行理财产品"> 银行理财产品
						</label>
						<label class="checkbox-inline">
						  <input type="checkbox" id="inlineCheckbox9" name="experience" value="其他"> 其他
						</label>
					</div>
				</div>
				
				<div class="row">
					<div class="col-md-6">
						<div class="form-group">
							<input type="hidden" name="member" value="${member!}">
							<input type="hidden" name="code" value="${code!}">
							<h4>会员编号：<span>${member!}</span></h4>
						</div>
					</div>
					<div class="col-md-6">
						<div class="form-group">
							<h4>会员名称：<span>${memberName!}</span></h4>
						</div>
					</div>
				</div>
				
				<div class="row">
					<div class="col-md-6">
						<div class="form-group">
							<label for="name">客户姓名：</label>
							<input type="text" class="form-control" id="name" name="name" placeholder="姓名">
						</div>
					</div>
					<div class="col-md-6">
						<div class="form-group">
							<label for="CID">身份证号：</label>
							<input type="hidden" value="0" id="CID_flag" />
							<input type="hidden" value="身份证号已被注册" id="CID_flag_msg" />
							<input type="text" class="form-control" onblur="checkCID()" id="CID" name="CID" placeholder="身份证号">
						</div>
					</div>
				</div>
				
				<div class="row" >
					<div class="col-md-6">
						<div class="input-group">
							<span class="input-group-addon">&nbsp;&nbsp;Q&nbsp;&nbsp;&nbsp;&nbsp;Q&nbsp;&nbsp;&nbsp;</span>
							<input type="number" class="form-control" name="QQ" placeholder="QQ号码">
						</div>
					</div>
					<div class="col-md-6">
						<div class="input-group">
							<span class="input-group-addon">邮箱地址</span>
							<input type="email" class="form-control" name="email" placeholder="邮箱地址">
						</div>
					</div>
				</div>
				
				<div class="row" style="margin-top: 15px;">
					<div class="col-md-6">
						<div class="input-group">
							<input type="text" maxlength="11" class="form-control" id="phone" name="phone" placeholder="手机号码">
							<span class="input-group-btn">
						        <button class="btn btn-success" id="getYZM" onclick="sendYZM()" type="button">获取验证码</button>
						    </span>
						</div>
					</div>
					<div class="col-md-6">
						<div class="input-group">
							<span class="input-group-addon">验证号码</span>
							<input type="hidden" value="0" id="yzm_flag" />
							<input type="hidden" value="0" id="yzm_flag_msg" />
							<input type="text" class="form-control" onblur="checkYZM()" id="yzm" name="yzm" placeholder="验证号码">
						</div>
					</div>
				</div>
				
				<div class="row" style="margin-top: 15px;">
					<div class="col-md-6">
						<div class="input-group">
							<span class="input-group-addon">签约银行</span>
							<select id="bank" name="bank" class="form-control">
							  <option value="建设银行">建设银行</option>
							  <option value="中国银行">中国银行</option>
							  <option value="农业银行">农业银行</option>
							  <option value="招商银行">招商银行</option>
							  <option value="平安银行">平安银行</option>
							</select>
						</div>
					</div>
					<div class="col-md-6">
						<div class="input-group">
							<span class="input-group-addon">银行卡号</span>
							<input type="text" class="form-control" id="card" name="card" placeholder="银行卡号">
						</div>
					</div>
				</div>
				
				<div class="row" style="margin-top: 15px;">
					<div class="col-md-12">
						<div class="input-group">
							<span class="input-group-addon">常驻地址</span>
							<input type="text" class="form-control" id="address" name="address" placeholder="常驻地址">
						</div>
					</div>
				</div>
				
				<div class="row" style="margin-top: 15px;">
					<div class="col-md-12">
						<label for="sfz_1">身份证正面：</label>
					</div>
				</div>
				<div class="row">
					<div class="col-md-12">
						<span style="font-size: 10px; color: red;">需提供本人有效身份证证件，所有信息需要清晰可见。
						证件必须是清晰彩色原件电子版，可以是扫描件或者数码拍摄照片。
						需保证照片内容真实有效，不得做任何修改。
						仅支持jpg、gif、png、jpeg图片格式，图片大小不能超过3M。
						</span>
					</div>
				</div>
				<div class="row" >
					<div class="col-md-12">
						<div class="form-group">
				            <input type="file" name="sfz_1" class="file-loading" id="sfz_1" multiple>
				            <div id="errorBlock" class="help-block"></div>
				        </div>
					</div>
				</div>
				
				<div class="row" >
					<div class="col-md-12">
						<label for="sfz_1">身份证反面：</label>
					</div>
				</div>
				<div class="row">
					<div class="col-md-12">
						<span style="font-size: 10px; color: red;">需提供本人有效身份证证件，所有信息需要清晰可见。
						证件必须是清晰彩色原件电子版，可以是扫描件或者数码拍摄照片。
						需保证照片内容真实有效，不得做任何修改。
						仅支持jpg、gif、png、jpeg图片格式，图片大小不能超过3M。
						</span>
					</div>
				</div>
				<div class="row" >
					<div class="col-md-12">
						<div class="form-group">
				            <input type="file" name="sfz_2" class="file-loading" id="sfz_2" multiple>
				            <div id="errorBlock" class="help-block"></div>
				        </div>
					</div>
				</div>
				
				<div class="row">
					<div class="col-md-12">
						<label for="sfz_1">身份证手持：</label>
					</div>
				</div>
				<div class="row">
					<div class="col-md-12">
						<span style="font-size: 10px; color: red;">需提供本人有效身份证证件，所有信息需要清晰可见。
						证件必须是清晰彩色原件电子版，可以是扫描件或者数码拍摄照片。
						需保证照片内容真实有效，不得做任何修改。
						仅支持jpg、gif、png、jpeg图片格式，图片大小不能超过3M。
						</span>
					</div>
				</div>
				<div class="row">
					<div class="col-md-12">
						<div class="form-group">
				            <input type="file" name="sfz_3" class="file-loading" id="sfz_3" multiple>
				            <div id="errorBlock" class="help-block"></div>
				        </div>
					</div>
				</div>
				
				<div class="row">
					<div class="col-md-4">
					</div>
					<div class="col-md-4">
						<button type="submit" class="btn btn-success btn-block">提交</button>
					</div>
					<div class="col-md-4">
					</div>
				</div>
			</form>
		</div>
		
		<div class="container-fluid">
			<hr />
			<h5 style="text-align: center; color: #CCC;">XXXX交易中心</h5>
		</div>
		<!-- jQuery (necessary for{request.contextPath}/bootstrap's JavaScript plugins) -->
		<script src="${request.contextPath}/bootstrap/js/jquery.min.js"></script>
		<script src="${request.contextPath}/bootstrap/js/bootstrap.min.js"></script>
		<script src="${request.contextPath}/bootstrap/js/fileinput.min.js" type="text/javascript"></script>
	    <script src="${request.contextPath}/bootstrap/js/fileinput_locale_zh.js" type="text/javascript"></script>
	    <script src="${request.contextPath}/bootstrap/js/CID.js"></script>
	    <script src="${request.contextPath}/bootstrap/js/form.js"></script>
	    <script type="text/javascript">
	    	$(document).on('ready', function() {
	    		var fileinput_config = {
	    			language:"zh",
			    	showCaption: true,
			        showPreview: true,
			        showRemove: true,
			        showUpload: false,
			        showCancel: false,
			        allowedFileExtensions: ["jpg", "png"],
			        maxFileSize: 3000,
			        initialPreview: [
			            '<img src="${request.contextPath}/bootstrap/img/sfz_1.png" class="file-preview-image" alt="示例图片" title="示例图片">'
			        ],
			        overwriteInitial: true,
			        initialCaption: "请选择文件"
	    		}
			    $("#sfz_1").fileinput(fileinput_config);
			    $("#sfz_2").fileinput({
			    	initialPreview: [
 			            '<img src="${request.contextPath}/bootstrap/img/sfz_2.png" class="file-preview-image" alt="示例图片" title="示例图片">'
 			        ]
			    });
			    $("#sfz_3").fileinput({
			    	initialPreview: [
  			            '<img src="${request.contextPath}/bootstrap/img/sfz_3.jpg" class="file-preview-image" alt="示例图片" title="示例图片">'
  			        ]
			    });
			});
	    </script>
	</body>
</html>